<template>
  <div class="equipment-query">
    <span class="label">设备查询：</span>
    <el-input v-model="input1" placeholder="输入设备名称" class="input" />
    <!-- v-on:click="handleButtonClick"定义一个事件监听器，表示在按钮被点击时执行相应的逻辑，引号里是被调用的方法名 -->
    <el-button type="primary" plain class="query" @click="handleButtonClick">查询</el-button>
    <br>
    <el-tag class="list block-tag" type="success" dark>设备列表</el-tag>
  </div>
</template>

<script>
export default {
  data() {
    return {
      input1: ''
    }
  },
  methods: {
    handleButtonClick() {
      console.log('按钮被点击了')
    }
  }
}
</script>

  <style scoped>
  .equipment-query{
   margin-top: 50px;
   margin-left: 50px;
    display: flex;
    align-items: center;
  }

  .block-tag {
  display: block;
}

.label {
  margin-right: 3px;
}

.input {
  width:200px;
}

.query{
  margin-left: 3px;
}

  </style>
